/**
 * 一般的呈現模式
 * 類似九官格
 */
function GotoNormal() {
	var html = '';
	html += '<div style="width: 100%">\n';
	html += '<div id="typef" style="font-size: 14px; color: #CC6666; font-weight: bold; text-align: center;">請選擇一個影片</div>\n';
	html += '<table border="0" cellspacing="0" cellpadding="0" align="center">\n';
	for (var i=0;i<books.length;i++) {
		if (i%3==0) {
			html += '<tr height="50">\n';
		}
		html += '<td width="65" align="center" valign="middle" title="點選後開啟"><img style="border: 1px solid #CCCCCC; cursor: pointer;" src="'+books[i].image+'" width="50" border="0" onmouseover="sbar(this, \''+i+'\');" onmouseout="cbar(this, \''+i+'\');"></img></td>\n';
		if (i%3==2||i+1==books.length) {
			html += '</tr>\n';
		}

	}
	html += '</table>\n';
	html += '</div>';
	_gel(pageId).innerHTML = html;
	SetAnchor();
}

/**
 * 幻燈片呈現模式
 * 在固定時間內會一直重覆播放
 * 可設定高度
 */
function GotoSlides(H) {
	var divWidth = (3 * 50);
	var tableWidth = (books.length * 50) + (books.length * 6)
	var html = '';
	html += '<center>\n';
	html += '<div id="showbook_'+module+'" style="height: '+H+';">\n';
	html += '</div>\n';
	html += '<hr size="1">\n';
	html += '<div style="width: '+divWidth+'; padding: 4px 0px; border: 1px solid #6666FF; overflow: hidden;">\n';
	html += '<table id="table_'+module+'" width="" border="0" cellspacing="0" cellpadding="0">\n';
	html += '<tr>\n';
	for (var i=0;i<books.length;i++) {
		html += '<td><a style="cursor: pointer;" onClick="focusId='+i+';display_book();"><img class="book_'+module+'" src="'+books[i].image+'" width="50"></img></a></td>\n';
	}
	html += '</tr>\n';
	html += '</table>\n';
	html += '</div>\n';
	html += '</center>\n';
	_gel(pageId).innerHTML = html;
	SetAnchor();
	display_book();
	if (slides_status==undefined) slides_status = true;
//	if (slides_status!=false) {
		try{
			clearInterval(slides);
		}catch(e){
			slides = null;
		}
		slides_sec = prefs.getString("mysec") * 1000;
		slides = setInterval("autoSlides();", slides_sec);
//	}
}

/**
 * 幻燈片呈現的緩衝帶
 * 用來決定要往右走還是往左走
 */
function autoSlides() {
	if (focusId==0) op = '++';
	else if (focusId==books.length-1) op = '--';
	var command = 'focusId'+op+';';
	eval(command);
	display_book();
}

/**
 * 幻燈片實際呈現
 * 根據 focusId ，決定目前呈現的書本資料
 */
function display_book() {
	var html = '';
	if (books[focusId].typef!=undefined) html += '<div style="font-size: 14px; color: #CC6666; font-weight: bold; text-align: center;">'+books[focusId].typef+'</div>\n';
	if (books[focusId].title!=undefined) html += '<div style="font-size: 12px; font-weight: bold; color: #6666FF;">'+books[focusId].title+'</div>\n';
	if (slides_status==undefined) slides_status = true;
	if (books[focusId].other!='' && slides_status!=false) {
		html += '<div style="float: left; border: 1px solid #CCCCCC;"><img src="'+books[focusId].image+'" width="100" border="0" style="padding: 5px;"></img></div>\n';
		html += '<div style="text-align: left; font-size: 12px; color: #660033; line-height: 20px;">'+books[focusId].other+'</div>\n';
	} else {
		html += '<div style="border: 1px solid #CCCCCC;"><img src="'+books[focusId].image+'" width="100" border="0" style="padding: 5px;"></img></div>\n';
		html += '<div style="text-align: center; font-size: 12px; color: #660033; line-height: 20px;">'+books[focusId].other+'</div>\n';
	}
	html = str_replace('undefined', '', html);
	_gel("showbook_"+module).innerHTML = html;
	SetAnchor();

	var img = $("img[@class=book_"+module+"]");
	for (var i=0;i<img.length;i++) {
		if (i==focusId) {
			img[i].style.border = '2px solid #FF0066';
		} else {
			img[i].style.border = '0px';
		}
	}

	var moveObj = _gel('table_'+module);
	if (moveObj==undefined) {
		return;
	}
	moveObj.style.position = "relative";
	if (focusId==0) {
		moveObj.style.left = 50;
	} else {
		moveObj.style.left = -((focusId-1) * 50);
	}
//	if (slides_status!=false) {
		try{
			clearInterval(slides);
		}catch(e){
			slides = null;
		}
		slides_sec = prefs.getString("mysec") * 1000;
		slides = setInterval("autoSlides();", slides_sec);
//	}
	return;
}

function sbar(st, n) {
	st.width = "60";
	st.style.borderColor = "#6666FF";
	if (books[n].typef!=undefined) _gel("typef").innerHTML = books[n].typef;
	return;
}

function cbar(st, n) {
	st.width = "50";
	st.style.borderColor = "#CCCCCC";
	_gel("typef").innerHTML = "請選擇一個影片";
	return;
}

